import {View} from "@tarojs/components"
import {Component} from "react"
import util from "../../../libs/util"

import './index.scss'
import Item from "./item"

class Ltabs extends Component {
  constructor(props) {
    super(props)
    this.state = {
      ltabsList: util.deepClone(props.ltabsList)
    }
  }
  undataLtabsList = function (activeObj) {
    this.state.ltabsList.forEach(item => {
      item.active = item.name === activeObj.name;
    })
    this.props.clickLtabs(activeObj)
    this.setState({ ltabsList: this.state.ltabsList });
  }
  render() {
    const {ltabsList} = this.state
    return (
      <View className='Ltabs-box'>
        {
          ltabsList.map((item, index) => {
            return <Item
              key={index}
              item={item}
              ltabsList={ltabsList}
              undataLtabsList={this.undataLtabsList.bind(this)}
            />
          })
        }
      </View>
    )
  }
}
export default Ltabs
